<!-- 会员列表> 基本负责人 -->
<template>
  <div>
    <div class="table-page-search">
      <a-form>
        <a-form-item label="关键词">
          <a-input placeholder="姓名/手机号" v-model="queryParam.keyword" allowClear />
        </a-form-item>
        <a-form-item label="单位身份">
          <a-select v-model="queryParam.memberRoleType" placeholder="请选择" allowClear>
            <a-select-option
              v-for="dict in Dict.getLocal('companyIdentityDict')"
              :key="dict.dictValue"
              :value="dict.dictValue"
              >{{ dict.dictLabel }}
            </a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item label="小程序">
          <a-select v-model="queryParam.isLogin" placeholder="请选择" allowClear>
            <a-select-option v-for="dict in Dict.getLocal('isLoginDict')" :key="dict.dictValue" :value="dict.dictValue">
              {{ dict.dictLabel }}
            </a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item label="公众号">
          <a-select
            v-model="queryParam.isOfficialAccount"
            placeholder="请选择"
            allowClear
            :showArrow="true"
            class="min-width-15"
          >
            <a-select-option
              v-for="dict in Dict.getLocal('isOfficialAccountDict')"
              :key="dict.dictValue"
              :value="dict.dictValue"
            >
              {{ dict.dictLabel }}
            </a-select-option>
          </a-select>
        </a-form-item>
        <span class="search-submitButtons">
          <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
          <a-button @click="handleReset">重置</a-button>
        </span>
      </a-form>
    </div>
    <div class="table-operator">
      <a-button type="primary" icon="plus" @click="handleAdd">新增人员</a-button>
    </div>
    <s-table size="default" ref="table" rowKey="userId" :rowSelection="null" :columns="columns" :data="loadData">
      <span slot="serial" slot-scope="text, record, index">
        {{ (pageNum - 1) * pageSize + index + 1 }}
      </span>
      <!-- 用户信息 -->
      <template slot="userInfo" slot-scope="text, record, index">
        <div class="disFlxAC">
          <a-avatar size="default" icon="user" :src="record.avatar" />
          <div class="_pl-10 fz-12">
            <div>{{ record.name }}</div>
            <div>{{ record.phone }}</div>
          </div>
        </div>
      </template>
      <span slot="memberRoleType" slot-scope="text">
        <DictTag :options="Dict.getLocal('companyIdentityDict')" :value="text" isText showBorder />
      </span>

      <!-- 小程序登录状态 -->
      <span slot="isLogin" slot-scope="text">
        <DictTag :options="Dict.getLocal('isLoginDict')" :value="text" isText />
      </span>

      <!-- 公众号关注状态 -->
      <span slot="isOfficialAccount" slot-scope="text">
        <DictTag :options="Dict.getLocal('isOfficialAccountDict')" :value="text" isText />
      </span>

      <span slot="action" slot-scope="text, record">
        <a @click="handleEdit(record, 'edit')">编辑</a>
        <a-divider type="vertical" />
        <a @click="handleEdit(record, 'detail')">详情</a>
        <template v-if="record.memberRoleType != 1">
          <a-divider type="vertical" />
          <a @click="delByIds([record.id])">删除</a>
        </template>
      </span>
    </s-table>
    <leader-form ref="leaderForm" @add="$refs.table.refresh(true)" @upd="$refs.table.refresh()" />
  </div>
</template>

<script>
import { STable } from '@/components'
import leaderForm from './leaderForm'
import { leadingMemberList, leadingMemberDel } from '@/api/system/system'
import DictTag from '@/components/DictTag'

export default {
  props: ['applyType'],
  components: {
    STable,
    leaderForm,
    DictTag,
  },
  data() {
    return {
      // 查询参数
      queryParam: {
        keyword: undefined,
        memberRoleType: undefined,
        isLogin: undefined,
        isOfficialAccount: undefined,
      },
      // 表头
      columns: [
        {
          title: '序号',
          scopedSlots: { customRender: 'serial' },
          width: '80px',
        },
        {
          title: '成员信息',
          width: '220px',
          scopedSlots: { customRender: 'userInfo' },
        },
        {
          title: '管理员身份',
          dataIndex: 'memberRoleType',
          width: '200px',
          ellipsis: true,
          scopedSlots: { customRender: 'memberRoleType' },
        },
        {
          title: '单位职务',
          dataIndex: 'socialPosition',
          width: '200px',
        },
        {
          title: '小程序',
          dataIndex: 'isLogin',
          width: '200px',
          scopedSlots: { customRender: 'isLogin' },
        },
        {
          title: '公众号',
          dataIndex: 'isOfficialAccount',
          width: '200px',
          scopedSlots: { customRender: 'isOfficialAccount' },
        },
        {
          title: '操作',
          width: '150px',
          fixed: 'right',
          dataIndex: 'action',
          scopedSlots: { customRender: 'action' },
        },
      ],
      pageNum: 1,
      pageSize: 10,
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        var params = {
          current: parameter.pageNum,
          size: parameter.pageSize,
          cocId: this.$route.query.id,
        }
        return leadingMemberList(Object.assign(params, this.queryParam)).then((res) => {
          this.pageNum = parameter.pageNum
          this.pageSize = parameter.pageSize
          this.selectedRowKeys = []
          this.selectedRows = []
          this.ids = []
          return res
        })
      },
      pageSelectedObj: {
        1: [],
      },
    }
  },
  created() {},
  methods: {
    handleReset() {
      Object.keys(this.queryParam).forEach((k) => {
        this.queryParam[k] = undefined
      })
      this.handleOk()
    },
    handleAdd() {
      var params = {
        title: '新增',
        type: 'add',
      }
      this.$refs.leaderForm.add(params)
    },
    handleEdit(record, type) {
      var obj = JSON.parse(JSON.stringify(record))
      if (record.politicalTitle) {
        obj.politicalTitle = record.politicalTitle.split(',')
      } else {
        obj.politicalTitle = undefined
      }
      var params = {
        title: '编辑',
        type: type,
        data: obj,
      }
      this.$refs.leaderForm.edit(params)
    },

    handleOk() {
      this.$refs.table.refresh(true)
    },
    handleReload() {
      this.$refs.table.refresh()
    },
    delByIds(ids) {
      var _this = this
      this.$confirm({
        title: '删除?',
        content: '是否确定删除该主要负责人?',
        onOk() {
          leadingMemberDel({ ids: ids.join(',') }).then((res) => {
            if (res.code === 0) {
              _this.$message.success(`删除成功`)
              _this.handleReload()
            } else {
              _this.$message.error(res.msg)
            }
          })
        },
        onCancel() {},
      })
    },
  },
}
</script>
<style scoped lang="less"></style>
